<template src="../template/userCenter.html">
</template>

<script>
import md5 from '../../es/md5Util';
import stmTable from '../modules/stm-table';
import stmForm from '../modules/stm-form';
import bankAddDialog from '../modules/bank-add-dialog';
import IdentityCodeValid from '../../es/idValidate';

export default {
  name: 'userCenter',
  components: { stmTable, stmForm, bankAddDialog },
  data() {
    const validateOldPass = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请输入新密码'));
      } else if (value === this.pwForm.oldPwd) {
        callback(new Error('不能使用相同密码'));
      } else {
        callback();
      }
    };
    const validatePass = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请再次输入密码'));
      } else if (value !== this.pwForm.firstPwd) {
        callback(new Error('两次输入密码不一致!'));
      } else {
        callback();
      }
    };
    const checkEmail = (rule, value, callback) => {
      if (!value) {
        callback();
      } else if (/^\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}$/.test(value) === false) {
        callback(new Error('请输入正确的邮箱格式'));
      } else {
        callback();
      }
    };
    const checkTel = (rule, value, callback) => {
      if (!value) {
        callback();
      } else {
        callback();
      }
    };
    const checkCard = (rule, value, callback) => {
      if (!value) {
        callback();
      }
      const result = IdentityCodeValid(value);
      if (result !== true) {
        callback(new Error(result));
      } else {
        if (value && value.length === 18) {
          const birthday = `${value.slice(6, 10)}-${value.slice(10, 12)}-${value.slice(12, 14)}`;
          this.userInfoForm.birthday = birthday;
          this.userInfoForm.gender = value.slice(16, 17) % 2 === 0 ? '女' : '男';
        }
        callback();
      }
    };
    return {
      userInfoForm: {},
      userInfoRules: {
        empIdCardNo: [
          { validator: checkCard, trigger: 'blur, change' },
        ],
        empMobileNo: [
          { validator: checkTel, trigger: 'blur, change' },
        ],
        email: [
          { validator: checkEmail, trigger: 'blur, change' },
        ],
      },
      passwordVisible: false,
      pwItemInfo: [
        {
          TYPE: 'PWD',
          LABEL: '旧密码',
          CODE: 'oldPwd',
          REQUIRED: true,
        },
        {
          TYPE: 'PWD',
          LABEL: '新密码',
          CODE: 'firstPwd',
          REQUIRED: true,
        },
        {
          TYPE: 'PWD',
          LABEL: '确认密码',
          CODE: 'secondPwd',
          REQUIRED: true,
        },
      ],
      pwForm: {
        oldPwd: '',
        firstPwd: '',
        secondPwd: '',
      },
      formLabelWidth: '70px',
      pwRules: {
        firstPwd: [
          { required: true, validator: validateOldPass, trigger: 'change, blur' },
        ],
        secondPwd: [
          { required: true, validator: validatePass, trigger: 'change, blur' },
        ],
      },
      // 银行信息
      bankTableColumn: [
        {
          LABEL: '收款人名称',
          CODE: 'accountName',
          WIDTH: '120',
        },
        {
          LABEL: '支行',
          CODE: 'bankName',
          WIDTH: '250',
        },
        {
          LABEL: '银行帐号',
          CODE: 'bankAccountNo',
          WIDTH: '250',
        },
        {
          LABEL: '是否默认',
          CODE: 'isDefault',
          TEMP: 'default',
          WIDTH: '100',
        },
        {
          LABEL: '操作',
          CODE: 'operate',
          TEMP: 'bankOper',
          WIDTH: '150',
        },
      ],
      bankTableData: [],
      bankDialogVisible: false,
      bankTitle: '',
      bankForm: {
        accountName: '',
        bankName: '',
        bankCode: '',
        bankAddr: '',
        isDefault: '001',
      },
      // 部门信息
      deptTableColumn: [
        {
          LABEL: '所属部门',
          CODE: 'deptName',
          WIDTH: '200',
        },
        {
          LABEL: '当前部门',
          CODE: 'isNowDept',
          TEMP: 'now',
          WIDTH: '100',
        },
        {
          LABEL: '是否默认',
          CODE: 'isDefault',
          TEMP: 'default',
          WIDTH: '100',
        },
        {
          LABEL: '操作',
          CODE: 'operate',
          TEMP: 'deptOper',
          WIDTH: '150',
        },
      ],
      deptTableData: [],
      leader: '',
      msgSwitch: null,
      hiddenUserInfo: false,
    };
  },
  mounted() {
    this.getUserInfo();
    this.searchAllBankAccountInfo();
    this.getUserDept();
    this.msgSwitch = this.$cookie.get('messageSwitch');
  },
  watch: {
    msgSwitch(val) {
      this.$cookie.set('messageSwitch', val);
    },
  },
  computed: {

    userInfo() {
        // 个人信息
      const userInfo = [
        {
          TYPE: 'TEXT',
          LABEL: '员工名称',
          CODE: 'name',
          REQUIRED: true,
        },
        {
          TYPE: 'TEXT',
          LABEL: '登陆账号',
          CODE: 'samAccountName',
          DISABLE: true,
        },
        {
          TYPE: 'TEXT',
          LABEL: '工号',
          CODE: 'no',
          DISABLE: true,
        },
        {
          TYPE: 'PWD',
          LABEL: '身份证号码',
          CODE: 'empIdCardNo',
          SHOWPWD: false,
          HIDDEN: this.hiddenUserInfo,
        },
        {
          TYPE: 'TEXT',
          LABEL: '国籍',
          CODE: 'nationality',
          HIDDEN: this.hiddenUserInfo,
        },
        {
          TYPE: 'RADIO',
          LABEL: '性别',
          CODE: 'gender',
          OPTIONS: [
            {
              label: '男',
              value: '男',
            },
            {
              label: '女',
              value: '女',
            },
          ],
        },
        {
          TYPE: 'DATE',
          LABEL: '生日',
          CODE: 'birthday',
          HIDDEN: this.hiddenUserInfo,
        },
        {
          TYPE: 'PWD',
          LABEL: '手机号码',
          CODE: 'empMobileNo',
          REQUIRED: true,
          SHOWPWD: false,
          HIDDEN: this.hiddenUserInfo,
        },
        {
          TYPE: 'TEXT',
          LABEL: '电子邮件',
          CODE: 'email',
        },
      ];

      return userInfo;
    },

    uploadUrl() {
      const uploadImageAppKey = 'test';
      const uploadImageAppSecret = '098f6bcd4621d373cade4e832627b4f6';
      const time = Date.parse(new Date());
      const token = md5(`${uploadImageAppSecret}upload.api${time}`).toUpperCase();
      const url = 'FMCSTORAGE/upload.api';

      return `${url}?token=${token}&ts=${time}&appKey=${uploadImageAppKey}`;
    },
  },
  methods: {
    handleAvatarSuccess(response) {
      if (response.code === '0') {
        this.userInfoForm.headUrl = response.data.fileUrl;
        this.userInfoForm.headCode = response.data.fileCode;
      } else {
        this.$message.error('头像上传失败！');
      }
    },
    // 个人信息接口
    getUserInfo() {
      this.$http.post('getUserInfo.ajax').then(
        (res) => {
          res = res.body;
          if (res.rspCode === '000000') {
            this.userInfoForm = res.rspData;
            this.hiddenUserInfo = res.rspData.hiddenUserInfo === 'Y';
          }
        },
        () => {},
      );
    },
    // 银行列表接口
    searchAllBankAccountInfo() {
      this.$http.post('searchAllBankAccountInfo.ajax').then(
        (res) => {
          res = res.body;
          this.bankTableData = res.rspData;
          if (!this.bankTableData.length) {
            this.$alert('请添加银行卡信息', '提示', {
              confirmButtonText: '确定',
            });
          }
        },
        () => {},
      );
    },
    // 所属部门接口
    getUserDept() {
      this.$http.post('getUserDept.ajax').then(
        (res) => {
          res = res.body;
          this.deptTableData = res.rspData.userDepatement;
          this.leader = res.rspData.superior;
        },
        () => {},
      );
    },
    // 修改个人信息
    updateUserInfo(form) {
      this.$http.post('updateUserInfo.ajax', form).then(
        (res) => {
          res = res.body;
          if (res.rspCode === '000000') {
            this.$message({
              message: '保存资料成功',
              type: 'success',
            });
            this.getUserInfo();
          }
        },
        () => {},
      );
    },
    // 修改密码接口
    changePassword() {
      if (this.pwForm.oldPwd === '' || this.pwForm.firstPwd === '' || this.pwForm.secondPwd === '') {
        this.$message({
          message: '输入不能为空',
          type: 'warning',
        });
        return;
      } else if (this.pwForm.oldPwd === this.pwForm.firstPwd) {
        this.$message({
          message: '新旧密码不能相等！',
          type: 'error',
        });
        return;
      } else if (this.pwForm.secondPwd !== this.pwForm.firstPwd) {
        this.$message({
          message: '两次输入密码不一致!',
          type: 'error',
        });
        return;
      }
      this.passwordVisible = false;
      this.$http.post('changePassword.ajax', this.pwForm).then(
        (res) => {
          res = res.body;
          if (res.rspCode === '000000') {
            this.$message({
              message: '密码修改成功',
              type: 'success',
            });
            this.passwordVisible = false;
          }
        },
        () => {},
      );
    },
    // 设为默认银行
    updateBankAccountDefault(row) {
      const parmas = { id: row.id };
      this.$http.post('updateBankAccountDefault.ajax', parmas).then(
        (res) => {
          res = res.body;
          if (res.rspCode === '000000') {
            this.$message({
              message: '默认银行设置成功',
              type: 'success',
            });
            this.searchAllBankAccountInfo();
            this.getUserInfo();
          }
        },
        () => {},
      );
    },
    // 删除银行
    deleteBankAccountInfo(row) {
      this.$confirm('此操作将删除银行帐号, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        const parmas = { id: row.id };
        this.$http.post('deleteBankAccountInfo.ajax', parmas).then(
          (res) => {
            res = res.body;
            if (res.rspCode === '000000') {
              this.$message({
                message: '银行删除成功',
                type: 'success',
              });
              this.searchAllBankAccountInfo();
              this.getUserInfo();
            }
          },
          () => {},
        );
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消',
        });
      });
    },
    // 新增银行信息
    addBankInfo() {
      this.bankDialogVisible = true;
      this.bankTitle = '新增银行信息';
      this.bankForm = {
        accountName: this.userInfoForm.name,
        bankName: '',
        bankCode: '',
        bankAddr: '',
        isDefault: '001',
      };
    },
    // 修改银行信息
    editBankInfo(row) {
      this.bankDialogVisible = true;
      this.bankForm = Object.assign({}, this.bankForm, row);
      this.bankTitle = '修改银行信息';
    },
    // 提交银行信息
    updateBankInfo(form) {
      if (this.bankTitle === '新增银行信息') {
        this.addBankAccountInfo(form);
      } else {
        this.updateBankAccountInfo(form);
      }
    },
    // 新增银行接口
    addBankAccountInfo(form) {
      this.$http.post('addBankAccountInfo.ajax', form).then(
        (res) => {
          res = res.body;
          if (res.rspData === 'success') {
            this.$message({
              message: '银行添加成功',
              type: 'success',
            });
            this.bankDialogVisible = false;
            this.searchAllBankAccountInfo();
            this.getUserInfo();
          } else if (res.rspData === 'error') {
            this.$message({
              message: '银行账号已存在',
              type: 'warning',
            });
          }
        },
        () => {},
      );
    },
    // 修改银行信息
    updateBankAccountInfo(form) {
      this.$http.post('updateBankAccountInfo.ajax', form).then(
        (res) => {
          res = res.body;
          if (res.rspCode === '000000') {
            this.$message({
              message: '银行修改成功',
              type: 'success',
            });
            this.bankDialogVisible = false;
            this.searchAllBankAccountInfo();
            this.getUserInfo();
          }
        },
        () => {},
      );
    },
    // 切换部门
    switchDepatement(row) {
      const parmas = { id: row.deptId };
      this.$http.post('switchDepatement.ajax', parmas).then(
        (res) => {
          res = res.body;
          if (res.rspCode === '000000') {
            this.$message({
              message: '切换部门成功',
              type: 'success',
            });
            this.getUserDept();
            window.location.reload();
          }
        },
        () => {},
      );
    },
    // 设为默认部门
    updateDept(row) {
      const parmas = { id: row.id };
      this.$http.post('updateDept.ajax', parmas).then(
        (res) => {
          res = res.body;
          if (res.rspCode === '000000') {
            this.$message({
              message: '默认部门设置成功',
              type: 'success',
            });
            this.getUserDept();
          }
        },
        () => {},
      );
    },
    showOrHidePWD(info) {
      info.SHOWPWD = !info.SHOWPWD;
    },
  },
};
</script>

<style lang="scss" src='../css/userCenter.scss'></style>
